{extend name="./_content"}
{block name='mid'}
<div class="">
	<!-- 工具栏 -->
	<div id="toolbar">
		<button type="button" class="btn btn-success" onclick="view.fun();">
			<label class="glyphicon glyphicon-book"></label>
		</button>
	</div>
	
	<!-- 表格主体-->
	<table id="table">
		
	</table>
	<!-- 表格数据处理（未完待续） -->
	<script type="text/javascript">
		$(function () {
			view.init();
		});
	
		var view = {
			table:null,//表格对象
			dataUrl:'/index/user/data_list',//数据加载地址
			selectedData:null,//选中的数据,
			id:0,//操作数据的主键
			defaultColumns:function () {
				//表头数据列
				return [
					{checkbox:true},
					{field:'name',title:'姓名',align:'center'},
					{field:'nick',title:'昵称',sortable:true,align:'center'},
                    {field:'address',title:'地址',align:'center'},
                    {field:'create_time',title:'创建时间',align:'center'},
                    {field:'update_time',title:'更新时间',align:'center'},
					// {field:'id',title:'操作',formatter:function (argument) {
					// 	return "<a href='javascript:void(0)' onclick='view.delete("+argument+");'>删除</a>";
					// }}
				];
			},
			init:function () {
			    //初始化表格
				var that = this;
				this.table = $('#table').bootstrapTable({
					columns:that.defaultColumns(),
					classes:'table  table-hover text-center',
					url:that.dataUrl,
					pageSize:10,//每页条数,
					pageList:[5,10,20,100],//条数可选
					pagination:true,//是否显示分页
					sidePagination:'server',//分页方式，默认【client】，客户端分页,数据要求：json数组[{},{},{}]。为server时，数据为：[total:100,rows:[{},{},{}]]，其中total为数据总量，用作分页，rows为数据数组
					queryParams:function (argument) {
					    console.log(argument);
						return argument;
					},
					queryParamsType:'limit',//默认为【limit】，为【limit】时，请求参数为：limit、offset、order、search、sort。否则为：pageSize, pageNumber, searchText, sortName, sortOrder
					search:true,//是否显示搜索
					toolbar:'#toolbar',//工具栏
					responseHandler:function (argument) {
						console.log(argument);
						return argument;
					},
					height:500,
					escape:'false',//是否对富文本进行转义
					searchOnEnterKey:false,//设置为 true时，按回车触发搜索方法，否则自动触发搜索方法。
					searchText:'',//初始化搜索文字。
					searchTimeOut:500,//毫秒，搜索超时时间
					trimOnSearch:true,//搜索是否去除两边空格
					showColumns:true,//是否显示内容列下拉框
					showRefresh:true,//是否显示刷新按钮
					clickToSelect:true,//点击行选中
                    sortName:'id'
				});
				this.initEvent();
			},
			initEvent:function(){
				//事件
				this.table.on('load-success.bs.table',function (argument) {
					//加载成功时触发,其他事件请查看文档：http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/#%E4%BA%8B%E4%BB%B6
					//console.log(argument);
				});
			},
			fun:function(){
				//getSelections:获取选中行
				//其他方法请查看文档：http://bootstrap-table.wenzhixin.net.cn/zh-cn/documentation/#%E6%96%B9%E6%B3%95
				var obj = this.table.bootstrapTable('getSelections');
				console.log(obj);
			},
			delete:function (id) {
				alert(id);
            }
		}
	</script>
</div>
{/block}